<template>
	<view class="apps">
		<view class="flex fdc">
			<view class="logo">
				<image :src="logo"></image>
			</view>
			<view class="flex aic jcc f16 ptb20 ">
				地平线便民服务
			</view>
			<view class="center"></view>
			<view class="btn" v-if="agree">
				<uv-button  iconColor="#fff"  open-type="chooseAvatar" @chooseavatar="avataraction" text="授权登录" v-if="step==0"></uv-button>
				<uv-button  iconColor="#fff"   open-type="getPhoneNumber" @getphonenumber="mobilelogin" text="授权登录" v-if="step==1"></uv-button>
			</view>
			<view class="btn" v-else>
				<uv-button  iconColor="#fff" @click="showAgree()" text="授权登录"></uv-button>
			</view>
			<view class="canshu">
				<view class="box" @click="Agree()">
					<uv-icon name="checkbox-mark" size="28rpx" color="#3c9cff" v-if="agree"></uv-icon>
				</view>
				<view class="content">
					我已阅读并同意
					<navigator url="/pages/index/agreement" class="link dib" hover-class="none">《用户服务协议》</navigator>和
					<navigator url="/pages/index/policy" class="link dib" hover-class="none">《用户隐私政策》</navigator>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	let app;
	import { util } from '/common/util.js';
	export default {
		data() {
			return {
				step:0,
				avatarUrl:"",
				agree:false,
				logo:"https://mp.lifecloud.top/static/images/logo.jpg"
			}
		},
		onLoad(){
			app = this;
			this.step=0;
			this.agree=false;
			this.avatarUrl ="";
		},
		onShow(){
			
		},
		methods: {
			avataraction (e){
				console.log(e);
				util.upload({
					file:e.avatarUrl,
					success:function(rlt){
						console.log(rlt);
						app.avatarUrl = rlt.data.file.full_url;
						console.log(app.avatarUrl);
						app.step = 1;
					}
				})
			},
			mobilelogin:function(e){
				console.log(e);
				if(e.errMsg =="getPhoneNumber:ok"){
					let openid = uni.getStorageSync('HORIZON_openid');
					// 请求接口
					util.request({
						url: '/mpwechat/login',
						data: {code:e.code,openid:openid,avatar:app.avatarUrl},
						load: 1,
						success(rlt) {
							if (rlt.code == 200) {
								util.alert('登录成功');
								
								uni.setStorageSync('HORIZON_userinfo',rlt.data);
								uni.setStorageSync('HORIZON_token',rlt.data.token);
								
								setTimeout(() => {
									if(uni.getStorageSync('remount_url')){
										const remount = JSON.parse(uni.getStorageSync('remount_url'));
										uni.setStorageSync('remount_url',null);
										if(remount.type== 'switch'){
											uni.switchTab({
												url:remount.page
											})
										}
										if(remount.type== 'nav'){
											uni.redirectTo({
												url:remount.page
											})
										}
									}else{
										uni.navigateBack();
									}
								}, 1000)
							} else {
								// 弹窗提示
								app.alert(rlt.msg)
								setTimeout(() => {
									uni.navigateBack();
								}, 1000)
							}
						},
					})
				}else{
					util.alert('您拒绝了授权');
					setTimeout(() => {
						uni.navigateBack();
					}, 1000)
				}
			},
			showAgree:function(){
				util.alert({
					title:"隐私及服务协议",
					value:"请阅读协议并点击同意"
				})
			},
			Agree:function(){
				app.agree = !app.agree;
			}
		}
	}
</script>

<style lang="scss" scoped>
	.logo{width:400rpx;height:300rpx; margin:0 auto;}
	.logo image{width:100%;height:100%;}
	.center{height:40rpx;}
	.btn{width:680rpx; margin:0 auto}
	.canshu{width:680rpx;font-size: 13px; color:#8c8c8c; padding: 20rpx 0;display: flex; flex-direction: row; margin:0 auto;
		.box{width:30rpx; height:30rpx;border: 1px solid #ccc;display: flex; align-items: center; border-radius: 5rpx; margin-right: 10rpx;}
		.content{flex:1;
		.link{display: inline;color: #3c9cff;}
		}
	}
</style>
